<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:insert="import :: head" >
    <meta charset="UTF-8">
    <title>springboot搭建的社区主页面</title>

    <!--引入自定义的import中的head 一些css，js的引入  th:replace="~{import :: head}"-->
    <!--<head th:insert="import :: head"></head>-->
    <!--<div th:include="import :: head"></div>-->


</head>
<script type="application/javascript">
    window.onload = function () {
        /*发表评论的时候未登录会弹窗，登录之后会在web的localStorage存储一个“closable”，为true
        在此读取并判断，读取到了就关闭新窗口，会回到评论页面，并手动清除localStorage的“closable”
        * */
        var closable = window.localStorage.getItem("closable");
        if (closable === "true") {
            window.close();
            window.localStorage.removeItem("closable");
        }
    }
</script>

<body>

<!--调用navigation.html中的nav 即我们自定义的导航栏-->
<div th:insert="navigation :: nav"></div>

<div class="container-fluid main" style="background-color: white">
    <div class="row">
        <!--上左-->
        <div class="col-lg-9 col-md-12 col-sm-12 col-xs-12">
            <h3><span class="glyphicon glyphicon-list" aria-hidden="true">发现</span></h3>
            <hr>
            <!--展示帖子-->
            <div th:each="post:${postListDTO}">
                <div class="media">
                    <div class="media-left">
                        <a href="#">
                            <img class="media-object img-circle"
                                 th:src="${post.user.avatarUrl}">
                        </a>
                    </div>
                    <div class="media-body">
                        <h4 class="media-heading">
                            <a th:text="${post.title}" th:href="@{'/post/'+ ${post.id}}">帖子标题</a>
                        </h4>
                        <span class="text-desc">
                            <span th:text="${post.commentCount}">0</span> 个回复 •
                            <span th:text="${post.viewCount}">0</span> 次浏览 •
                            最后一次访问时间：<span th:text="${#dates.format(post.gmtCreate,'yyyy-MM-dd HH:mm')}">yyyy-MM-dd HH:mm</span>
                        </span>
                    </div>
                </div>
            </div>

        </div>
        <!--上右-->
        <div class="col-lg-3 col-md-12 col-sm-12 col-xs-12">
            <h3>热门话题</h3>
        </div>
    </div>
</div>

<!--下 翻页按钮-->
<nav aria-label="Page navigation">
    <ul class="pagination pagination-lg">
        <p>当前 <span th:text="${postPageInfo.pageNum}"></span> 页,总 <span th:text="${postPageInfo.pages}"></span> 页,共 <span th:text="${postPageInfo.total}"></span> 条记录</p>

        <li>
            <a th:href="@{/(pageNum=1,searchMsg=${searchMsg})}" aria-label="Previous">
                <span aria-hidden="true">首页</span>
            </a>
        </li>
        <li><a th:href="@{/(pageNum=${postPageInfo.hasPreviousPage}?${postPageInfo.prePage}:1,searchMsg=${searchMsg})}">上一页</a></li>
        <li><a th:href="@{/(pageNum=${postPageInfo.hasNextPage}?${postPageInfo.nextPage}:${postPageInfo.pages},searchMsg=${searchMsg})}">下一页</a></li>
        <li>
            <a th:href="@{/(pageNum=${postPageInfo.pages},searchMsg=${searchMsg})}" aria-label="Next">
                <span aria-hidden="true">尾页</span>
            </a>
        </li>
    </ul>
</nav>

<!--引入我们自定义的footer中的foot 页脚文件 -->
<div th:insert="~{footer :: foot}"></div>
</body>
</html>